// 全局变量
let qtIndex = 1,    // 题目序号，初始为第1题
    sexResult,      // 性倾向bank01
    scoreE = 0,     // 外倾
    scoreI = 0,     // 内倾
    qtBank01,     // id为 1xxx 的题库
    qtBank02,     // id为 2xxx 的题库
    answerResult,   // 答案库
    initQt,     // 初始题
    fourQts;    // 4道题


// 获取id为 1xxx、2xxx 的题库、获取答案库
qtBank01 = bank01;
qtBank02 = bank02;
answerResult = result;


// 随机数
function getRandomNum(min, max){
    return Math.floor(Math.random()*(max-min+1))+min;
}


// 在id为 1xxx 的题库中随机 1 题
function getInitQt() {
    let qtBank1Data = qtBank01;
    let randomNum = getRandomNum(0, qtBank1Data.length-1);
    // 获取初始题
    let qt = qtBank1Data[randomNum];
    initQt = qt;
}
getInitQt();


// 在 2.json中随机4题
function getFourQts() {
    // 获取 2.json 题库
    let qtBank2Data = qtBank02;
    // 创建新数组，储存2json库中的所有题目的下标
    let arr = [];
    for(let i=0; i<qtBank2Data.length; i++){
        arr.push(i);
    }
    // 创建新数组，储存选中的题目
    let resultArr = [];
    // 创建新数组，储存选中的下标
    let outArr = [];
    // 最多获取随机数
    let num = 4;
    // 随机4题
    while (outArr.length < num){
        let temp = getRandomNum(0, arr.length-1);
        resultArr.push(qtBank2Data[arr[temp]]);
        outArr.push(arr.splice(temp, 1));
    }
    fourQts = resultArr;
}
getFourQts();


// 渲染初始题
function renderInitQt() {
    // 1.获取初始题
    let qt = initQt;
    // 2.渲染界面
    renderPage(qt);
    // 3.绑定点击事件
    clickListener(qt);
}


// 运行初始题渲染
renderInitQt();


// 2-5题
function nextQt(idx) {
    // 1.获取4道随机题
    let qts = fourQts;
    // 2.渲染界面
    renderPage(qts[idx-1]);
    // 3.绑定点击事件
    clickListener(qts[idx-1]);
}


// 渲染界面
function renderPage(qt) {
    // 1. 获取题目信息
    let qtId = qt.questionId;
    let qtTit = qt.questionTitle;
    let qtImg = qt.srcImg;
    let options = qt.options;
    // 2.渲染图片
    let initImgId = document.getElementById("initImg");
    initImgId.setAttribute("src", qtImg);
    // 3. 渲染题目
    let showQtId = document.getElementById("showQuestion");
    showQtId.setAttribute("data-id", qtId);
    showQtId.innerText = qtIndex + '. ' + qtTit;
    // 4. 渲染选项
    let optionHtml = "";
    for(let i=0; i<options.length; i++){
        optionHtml += "<li>" + options[i].option + ". " + options[i].optionInfo + "</li>";
    }
    let showOptionId = document.getElementById("showOption");
    showOptionId.innerHTML = optionHtml;
}


// 点击事件
function clickListener(qt) {
    // 1.获取需要绑定click事件的li
    let lisClick = document.getElementById("showOption").getElementsByTagName("li");
    let options = qt.options;
    // 2.给每个li绑定点击事件
    for(let i=0; i<lisClick.length; i++){
        lisClick[i].addEventListener("click", function () {
            clickLi(options[i]);
        });
    }
}


// 点击选项
function clickLi(option) {
    let idx = qtIndex;
    if(idx == 1){
        // 储存全局变量 性倾向
        let sexType = option.sexType;
        sexResult = sexType;
        // 全局变量 题目序号+1
        qtIndex++;
        // 下一题
        nextQt(idx);
    } else if(idx>=2 && idx<=4){
        // 计算倾向分
        let version = option.version;
        computeVersionScore(version);
        // 全局变量 题目序号+1
        qtIndex++;
        // 下一题
        nextQt(idx);
    } else if(idx == 5){
        // 计算倾向分
        let version = option.version;
        computeVersionScore(version);
        // 展示结果
        showResult();
    }
}


// 计算内倾外倾分数
function computeVersionScore(version) {
    if(version == "E"){
        scoreE++;
    } else if(version == "I"){
        scoreI++;
    }
}


// 展示最终答案
function showResult() {
    // 1. 性倾向 + 内倾/外倾
    let sexTxt;
    if(sexResult == "female"){
        sexTxt = "anima";
    } else {
        sexTxt = "animus";
    }
    let version = "";
    if(scoreE > scoreI){
        version = "E";
    } else {
        version = "I";
    }
    // 2. 拼成 resultId
    let aswResult = sexTxt + version;
    let resultData = answerResult;
    let resultVideo,    // video
        resultTxt,      // txt
        resultHeroImg,  // heroImg
        resultHeroTxt;  // heroTxt
    // 3. 通过 resultId 获取答案
    for(let i=0; i<resultData.length; i++){
        if(resultData[i].resultId == aswResult){
            resultVideo = resultData[i].videoSrc;
            resultTxt = resultData[i].txt;
            resultHeroImg = resultData[i].heroImg;
            resultHeroTxt = resultData[i].heroTxt;
        }
    }
    // 4. 显示测试结果，隐藏测试题展示
    document.getElementById("htmlTest").style.display = "none";
    document.getElementById("htmlResult").style.display = "block";
    // 5. 将最终答案结果，替换至 html
    let videoSrc = document.getElementById("videoSrc");
    let showResult = document.getElementById("showResult");
    let showResultHead = document.getElementById("showResultHead");
    let showResultHero = document.getElementById("showResultHero");
    videoSrc.setAttribute("src", resultVideo);
    showResult.innerText = resultTxt;
    // showResultHead.setAttribute("src", resultHeroImg);
    showResultHero.innerText = resultHeroTxt;
}


// 下载游戏
let uploadBtn = document.getElementById("uploadBtn");
uploadBtn.addEventListener("click", function () {
    // Facebook跳转用法
    callCTAClick();
});

// Facebook跳转用法
function callCTAClick() {
    FbPlayableAd.onCTAClick();
}











